<template>
	<view>
		<view class="topTab">
			<view class="detailTab" :class="tabIndex === 'detail' ? 'active' : ''" @click="tabIndex = 'detail'">任务</view>
			<view class="applyTab" :class="tabIndex === 'apply' ? 'active' : ''" @click="tabIndex = 'apply'">反馈</view>
		</view>
		<view v-show="tabIndex == 'detail'">
			<uni-card >
				<uni-section title="维修申请信息" type="line">
					<uni-forms ref="form" :modelValue="formData" label-width="100px">
						<uni-forms-item label="维修单编号" required name="applyCode">
							<view>{{ formData.applyCode }}</view>
						</uni-forms-item>
						<uni-forms-item label="设备" required name="equipId">
							<view>{{ formData.equipment.equipName }}</view>
						</uni-forms-item>
						<uni-forms-item label="申请内容">
							<view>{{ formData.applyContent }}</view>
						</uni-forms-item>
						<uni-forms-item label="图片">
							waiting..
						</uni-forms-item>
					</uni-forms>
				</uni-section>
			</uni-card>
		</view>
		<view v-show="tabIndex == 'apply'">
			<uni-card>
				<uni-section title="维修反馈" type="line">
					<uni-forms ref="apply" :modelValue="applyForm" label-width="100px">
						<uni-forms-item label="维修状态" required name="repairStatus">
							<uni-data-checkbox v-model="applyForm.repairStatus" :localdata="statusList"></uni-data-checkbox>
						</uni-forms-item>
						<uni-forms-item label="维修内容" required name="repairContent">
							<uni-easyinput type="textarea" v-model="applyForm.repairContent" placeholder="请输入备注" />
						</uni-forms-item>
						<uni-forms-item label="图片">
							waiting..
						</uni-forms-item>
					</uni-forms>
				</uni-section>
			</uni-card>
			<button type="primary" @click="submit()">提交</button>
		</view>
	</view>
</template>

<script>
	import { apply, getById } from '@/common/api/repair'
	export default {
		data() {
			return {
				// 表单参数
				formData: {
					applyCode: '',
					equipId: null,
					applyContent: ''
				},
				applyForm: {
					repairStatus: 1,
					repairContent: ''
				},
				loading: false,
				statusList: [{"value": 0,"text": "未维修"},{"value": 1,"text": "已维修"}],
				id: null,
				tabIndex: 'detail',
			}
		},
		components: {
		},
		onLoad(option) {
			this.id = option.id
			getById(option.id).then(res => {
				console.log(res, 'response')
				this.formData = res.data
			})
		},
		methods: {
			submit() {
				this.applyForm.applyId = this.id
				apply(this.applyForm).then(res => {
					console.log(res, 'review')
					if(res.respCode === '0000') {
						uni.showToast({
						  title: '反馈成功',
						  duration: 2000
						});
						uni.navigateBack()
					}
				})
			},
			uploadPic(index) {
				let token = uni.getStorageSync('App-Token');
				uni.chooseImage({
					count: 1,
					sizeType: ['original', 'compressed'],
					sourceType: ['album', 'camera'],
					success: (res) => {
						console.log(res, 'img')
						// const formData = new FormData()
						// formData.append('file', res.tempFilePaths[0])
						// upload(formData).then(res => {
						// 	console.log(res, 'upload')
						// })
						uni.uploadFile({
							url: '/api/system/file/upload',
							filePath: res.tempFilePaths[0],
							name: 'file',
							timeout: 60000,
							formData: {},
							method: 'POST',
							header: {
								'Content-Type': 'multipart/form-data',
								'Authorization': `Bearer ${token}`
							},
							success: (uploadFileRes) => {
								const data = JSON.parse(uploadFileRes.data)
								console.log('data', data)
								if (data.success) {
									uni.showToast({
										title: '上传成功',
										icon: 'success',
									})
								} else {
									uni.showToast({
										title: '上传失败',
										icon: 'none',
									})
								}
							},
							fail: (err) => {
								console.log('上传失败', err)
								uni.showToast({
									title: '上传失败',
									icon: 'none',
								})
							}
						})
					},
					fail: (err) => {
						console.log('选择图片失败', err)
					}
				})
			},
			openPic() {},
			deletePic(index) {
				this.recordList[index].fileList = []
				this.recordList[index].fileIds = null
				this.recordList[index].isPic = false
				this.recordList[index].picUrl = null
			}
		}
	}
</script>

<style lang="less">
	.topTab {
		margin: 15px;
		box-shadow: rgba(0, 0, 0, 0.08) 0px 0px 3px 1px;
		display: flex;
		view {
			width: 100%;
			text-align: center;
			height: 5vh;
			line-height: 5vh;
		}
		view.active {
			background-color: #007AFF;
			color: #fff;
		}
	}
	button {
		margin: 15px;
	}
</style>